<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:include="common">
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div class="panel-body">
    <div style="display:inline-block;">
        <div style="float:left;padding:6px;">
        </div>
        <div style="float:left;">
<!--            <input type="text" id="orderStartTime">-->
            <input id="orderStartTime"  type="date" class="form-control" style="width:200px;" placeholder="请输入下单开始时间" />
        </div>
        <div style="float:left;">
<!--            <input type="text" id="orderEndTime">-->
            <input id="orderEndTime" type="date" class="form-control" style="width:200px;" placeholder="请输入下单结束时间" />
        </div>

        <div style="float:left;">
            <input id="orderNum" class="form-control" style="width:200px;" placeholder="查询支付宝交易号" />
        </div>

        <div style="float:left;">
            <input type="radio" name="orderCondition" value="0">未支付
            <input type="radio" name="orderCondition"  value="1">已支付
            <input type="radio" name="orderCondition"  value="2">关闭
            <input type="radio" name="orderCondition"  value="3">完成
            <input type="radio" name="orderCondition"  value="4">退款中
        </div>
        <div style="float:left;margin-left:20px;">
            <button id="query" class="btn btn-primary">查询</button>
        </div>
    </div>
</div>

<table id="orderTable"></table>
</body>
<script>
    $(function (){
        queryOrderlist();
    })
    function  queryOrderlist(){
        $("#orderTable").bootstrapTable({
            url:"../user/queryOrderList", //user是映射的类，orderTable,是映射的方法
            columns:[
                {checkbox: true,visible: true },//是否显示复选框
             //   {field:'id',title:'id',sortable:true},
                {field:'orderId',title:'订单编号',sortable:true},
             //   {field:'orderNum',title:'支付宝交易号',sortable:true},
                {field:'shopEntity.goodsName',title:'项目名称',sortable:true},
                {field:'shopCount',title:'数量',sortable:true},
                {field:'shopTotal',title:'总价',sortable:true},
            //    {field:'realityShopTotal',title:'实际总价格',sortable:true},
            //    {field:'buyUserId',title:'购买用户id',sortable:true},
                {field:'buyUserName',title:'用户名',sortable:true},
            //    {field:'contacts',title:'联系人',sortable:true},
                {field:'contactsPhone',title:'电话',sortable:true},
                {field:'orderDate',title:'下单时间',sortable:true},
            //    {field:'payDate',title:'付款时间',sortable:true},
                {field:'finishDate',title:'完成时间',sortable:true},
                {field:'orderCondition',title:'订单状态',sortable:true},
                {field:'couponRecord',title:'优惠劵记录',sortable:true},
            //    {field:'zeroDescribe',title:'状态0描述',sortable:true},
            //    {field:'oneDescribe',title:'状态1描述',sortable:true},
            //    {field:'twoDescribe',title:'状态2描述',sortable:true},
            //    {field:'threeDescribe',title:'状态3描述',sortable:true},
            //    {field:'fourDescribe',title:'状态4描述',sortable:true},

                {field:'cz',title:'操作',sortable:true,formatter:function(value,row){
                        str = '';
                        str += '<button onclick="setId('+row.id+')" class="btn " data-toggle="modal" data-target="#myModal">上传</button>';
                        str += '<button onclick="getByCHhart('+row.id+')" class="btn ">查看七天的订单量</button>';
                        return str;
                    }},
            ],
            queryParams: function (params) {
                return {
                    orderStartTime: $('#orderStartTime').val(),
                    orderEndTime: $('#orderEndTime').val(),
                    orderNum: $('#orderNum').val(),
                    orderCondition:$('input[name="orderCondition"]:checked').val(),
                };
            },
            //开启分页以后，默认会传入两个参数,而这两个参数，直接是mysql的分页计算后的数据
            pagination:true,
            pageSize:2,
            pageList:[2,4,6,8,10],
            sidePagination : 'client',//server:服务器端分页{rows:[],total:10}|client：前端分页 [{},{}]
        })}

    //条查的按钮方法
    $('#query').click(function () {

        $('#orderTable').bootstrapTable('refresh')
    })

    //查看七天内的订单量,完成量,收入,收益

</script>
</html>